<template>
	<view>
		<CustomBackBar :title="$t('My.characters14')"></CustomBackBar>
	    <!-- 申请记录列表 -->
	    <view class="records-container">
	      <!-- 加载状态 -->
	      <view v-if="loading" class="loading">
	        <view class="loading-spinner"></view>
	        <p>...</p>
	      </view>
	
	      <!-- 空状态 -->
	      <view v-else-if="filteredRecords.length === 0" class="empty-state">
	        <i class="fas fa-inbox"></i>
	        <h3>{{$t('My.characters16')}}</h3>
	      </view>
	
	      <!-- 记录列表 -->
	      <view
	        v-for="record in filteredRecords"
	        :key="record.id"
	        class="record"
	      >
	        <view class="record-item">
	          <view class="applicant">
	            <i class="fas fa-user"></i>
	            {{ record.title }}
				<view class="record-content">
					<view>{{record.price}}</view>
					<view>{{record.consume}}</view>
				</view>
	          </view>
	          <!-- <view class="status" :class="getStatusClass(record.apply_status)">
	            <i :class="getStatusIcon(record.apply_status)"></i>
	            {{ getStatusText(record.apply_status) }}
	          </view> -->
	        </view>
	        <view class="creadtime">
	          <i class="far fa-clock"></i>
	          {{$t('My.characters16')}}：{{ record.time }}
	        </view>
	      </view>
	    </view>
	  </view>
</template>

<script src="./index.js"></script>
<style src="./index.scss" lang="scss"></style>